﻿<UserControl x:Class="DiscoveryLogic.UI.Layouts.Controls.Enrollment529SavingsVis"
    xmlns="http://schemas.microsoft.com/client/2007" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:wc="clr-namespace:DiscoveryLogic.UI.Layouts.WrappedControls" Height="400"
    xmlns:con="clr-namespace:DiscoveryLogic.UI.Layouts.Converters"
             >
    
    <Canvas x:Name="Root">
        <Canvas.Resources>

            <Storyboard x:Name="BarChartAnim" Completed="BarChartAnim_Completed">
                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BarCylinder" Storyboard.TargetProperty="(Canvas.Top)">
                    <SplineDoubleKeyFrame x:Name="BarChartTopAnimKeyFrame" KeyTime="00:00:01" Value="1.1" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>

                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BarCylinder" Storyboard.TargetProperty="Height">
                    <SplineDoubleKeyFrame x:Name="BarChartHeightAnimKeyFrame" KeyTime="00:00:01" Value="1.1" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>
                
                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BarHollowCylinder" Storyboard.TargetProperty="(Canvas.Top)">
                    <SplineDoubleKeyFrame x:Name="HollowBarChartTopAnimKeyFrame" KeyTime="00:00:01" Value="1.1" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>

                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BarHollowCylinder" Storyboard.TargetProperty="Height">
                    <SplineDoubleKeyFrame x:Name="HollowBarChartHeightAnimKeyFrame" KeyTime="00:00:01" Value="1.1" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>

            <Storyboard x:Name="BarChart2Anim" Completed="BarChart2Anim_Completed">
                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BarCylinder2" Storyboard.TargetProperty="(Canvas.Top)">
                    <SplineDoubleKeyFrame x:Name="BarChart2TopAnimKeyFrame" KeyTime="00:00:01" Value="1.1" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>

                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BarCylinder2" Storyboard.TargetProperty="Height">
                    <SplineDoubleKeyFrame x:Name="BarChart2HeightAnimKeyFrame" KeyTime="00:00:01" Value="1.1" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>

                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BarHollowCylinder2" Storyboard.TargetProperty="(Canvas.Top)">
                    <SplineDoubleKeyFrame x:Name="HollowBarChart2TopAnimKeyFrame" KeyTime="00:00:01" Value="1.1" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>

                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BarHollowCylinder2" Storyboard.TargetProperty="Height">
                    <SplineDoubleKeyFrame x:Name="HollowBarChart2HeightAnimKeyFrame" KeyTime="00:00:01" Value="1.1" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>

            <Storyboard x:Name="BarChartGoalAnim">
                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="GoalIndicatorCanvas" Storyboard.TargetProperty="(Canvas.Top)">
                    <SplineDoubleKeyFrame x:Name="BarChartGoalTopAnimKeyFrame" KeyTime="00:00:01" Value="1.1" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>


            <!--
            <Storyboard x:Name="BarChartMaxLabelAnim">
                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="test" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.X)">
                    <SplineDoubleKeyFrame KeyTime="00:00:01" Value="2" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>

                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="test" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.Y)">
                    <SplineDoubleKeyFrame KeyTime="00:00:01" Value="2" KeySpline="0.5,0,0.504,1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
            -->

            <con:CurrencyConverter x:Key="currConverter" />
            
        </Canvas.Resources>
        
        <!-- Stuff to put in the tab -->
        <wc:Slider x:Name="SavingsTargetSlider" Canvas.Left="0" Canvas.Top="100" Width="295" Height="20" ValueChanged="SavingsTargetSlider_ValueChanged" />
        
        <wc:Slider x:Name="InitialInvestmentSlider" Canvas.Left="0" Canvas.Top="160" Width="295" Height="20" ValueChanged="InitialInvestmentSlider_ValueChanged"/>
        
        <TextBlock Width="168.185" Height="18.501" TextWrapping="Wrap" FontFamily="Trebuchet MS" FontSize="14" Foreground="#FF1D62AF" Text="Savings Target" Canvas.Top="70"/>
		<Rectangle x:Name="SavingsTargetFrame" RenderTransformOrigin="0.5,0.5" Width="137.333" Height="16.664" Fill="#FFFFFFFF" RadiusX="3" RadiusY="3" Canvas.Left="152.422" Canvas.Top="70">
				<Rectangle.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Rectangle.RenderTransform>
				<Rectangle.Stroke>
					<LinearGradientBrush EndPoint="0.492,0" StartPoint="0.507,0.9">
						<GradientStop Color="#FFA7A47F" Offset="0"/>
						<GradientStop Color="#FFFFFFFF" Offset="1"/>
					</LinearGradientBrush>
				</Rectangle.Stroke>
			</Rectangle>
		<TextBlock x:Name="SavingsTargetLabel" Width="95.605" Height="18.501" TextWrapping="Wrap" FontFamily="Trebuchet MS" FontSize="14" Foreground="#FF000000" Text="^^^^^" Canvas.Left="192.422" Canvas.Top="70"/>			
            
		<TextBlock Width="168.185" Height="18.501" TextWrapping="Wrap" FontFamily="Trebuchet MS" FontSize="14" Foreground="#FF1D62AF" Text="Initial Investment" Canvas.Top="130"/>
		<Rectangle x:Name="InitialInvestmentFrame" RenderTransformOrigin="0.5,0.5" Width="137.333" Height="16.664" Fill="#FFFFFFFF" RadiusX="3" RadiusY="3" Canvas.Left="152.422" Canvas.Top="130">
				<Rectangle.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Rectangle.RenderTransform>
				<Rectangle.Stroke>
					<LinearGradientBrush EndPoint="0.492,0" StartPoint="0.507,0.9">
						<GradientStop Color="#FFA7A47F" Offset="0"/>
						<GradientStop Color="#FFFFFFFF" Offset="1"/>
					</LinearGradientBrush>
				</Rectangle.Stroke>
			</Rectangle>
		<TextBlock x:Name="InitialInvestmentLabel" Width="95.605" Height="18.501" TextWrapping="Wrap" 
                   FontFamily="Trebuchet MS" FontSize="14" Foreground="#FF000000" Text="{Binding Converter={StaticResource currConverter}}" 
                   Canvas.Left="192.422" Canvas.Top="130"/>				
			
        <!-- Bar Chart -->
        <Canvas x:Name="BarChartCanvas" Canvas.Left="40" Canvas.Top="100">
            <Canvas.RenderTransform>
                <ScaleTransform ScaleX="0.9" ScaleY="0.9" />
            </Canvas.RenderTransform>

        <Path x:Name="BarChartAxis" Width="306.5" Height="188" Stretch="Fill" Stroke="#FF777777" StrokeThickness="1" Canvas.Left="-17" Canvas.Top="103.5" Data="M3037.778,111.5 L3037.778,298.5 3384.7781,298.5"/>

        <TextBlock Width="12.641" Height="24.5" FontFamily="Trebuchet MS" FontSize="10" Foreground="#FF1D62AF" Text="Amount" Canvas.Left="-56.141" Canvas.Top="95"/>
        <TextBlock x:Name="BarChartAmountMaxLabel" Width="50.641" Height="24.5" FontFamily="Trebuchet MS" FontSize="10" Foreground="#FF1D62AF" Text="^300000" Canvas.Left="-60.141" Canvas.Top="105" HorizontalAlignment="Right"/>

        <!-- Chart Lines -->
        <Path Width="303.499" Height="1" Stretch="Fill" Stroke="#FF999999" StrokeThickness="0.5" Canvas.Left="-15" Canvas.Top="239" Data="M3060.1113,260.5 L3364.7787,260.5">
            <Path.Fill>
                <LinearGradientBrush EndPoint="-0.133,-0.143" StartPoint="1.1,0.998">
                    <GradientStop Color="#FF001161" Offset="0"/>
                    <GradientStop Color="#FF54B3FF" Offset="1"/>
                </LinearGradientBrush>
            </Path.Fill>
        </Path>
        <Path Width="303.499" Height="1" Stretch="Fill" Stroke="#FF999999" StrokeThickness="0.5" Canvas.Left="-15" Canvas.Top="214" Data="M3060.1113,260.5 L3364.7787,260.5">
            <Path.Fill>
                <LinearGradientBrush EndPoint="-0.133,-0.143" StartPoint="1.1,0.998">
                    <GradientStop Color="#FF001161" Offset="0"/>
                    <GradientStop Color="#FF54B3FF" Offset="1"/>
                </LinearGradientBrush>
            </Path.Fill>
        </Path>
        <Path Width="303.499" Height="1" Stretch="Fill" Stroke="#FF999999" StrokeThickness="0.5" Canvas.Left="-15" Canvas.Top="189" Data="M3060.1113,260.5 L3364.7787,260.5">
            <Path.Fill>
                <LinearGradientBrush EndPoint="-0.133,-0.143" StartPoint="1.1,0.998">
                    <GradientStop Color="#FF001161" Offset="0"/>
                    <GradientStop Color="#FF54B3FF" Offset="1"/>
                </LinearGradientBrush>
            </Path.Fill>
        </Path>
        <Path Width="303.499" Height="1" Stretch="Fill" Stroke="#FF999999" StrokeThickness="0.5" Canvas.Left="-15" Canvas.Top="164" Data="M3060.1113,260.5 L3364.7787,260.5">
            <Path.Fill>
                <LinearGradientBrush EndPoint="-0.133,-0.143" StartPoint="1.1,0.998">
                    <GradientStop Color="#FF001161" Offset="0"/>
                    <GradientStop Color="#FF54B3FF" Offset="1"/>
                </LinearGradientBrush>
            </Path.Fill>
        </Path>
        <Path Width="303.499" Height="1" Stretch="Fill" Stroke="#FF999999" StrokeThickness="0.5" Canvas.Left="-15" Canvas.Top="139" Data="M3060.1113,260.5 L3364.7787,260.5">
            <Path.Fill>
                <LinearGradientBrush EndPoint="-0.133,-0.143" StartPoint="1.1,0.998">
                    <GradientStop Color="#FF001161" Offset="0"/>
                    <GradientStop Color="#FF54B3FF" Offset="1"/>
                </LinearGradientBrush>
            </Path.Fill>
        </Path>
        <Path Width="303.499" Height="1" Stretch="Fill" Stroke="#FF999999" StrokeThickness="0.5" Canvas.Left="-15" Canvas.Top="114" Data="M3060.1113,260.5 L3364.7787,260.5">
            <Path.Fill>
                <LinearGradientBrush EndPoint="-0.133,-0.143" StartPoint="1.1,0.998">
                    <GradientStop Color="#FF001161" Offset="0"/>
                    <GradientStop Color="#FF54B3FF" Offset="1"/>
                </LinearGradientBrush>
            </Path.Fill>
        </Path>
        <Path Width="303.499" Height="1" Stretch="Fill" Stroke="#FF999999" StrokeThickness="0.5" Canvas.Left="-15" Canvas.Top="264" Data="M3060.1113,260.5 L3364.7787,260.5">
            <Path.Fill>
                <LinearGradientBrush EndPoint="-0.133,-0.143" StartPoint="1.1,0.998">
                    <GradientStop Color="#FF001161" Offset="0"/>
                    <GradientStop Color="#FF54B3FF" Offset="1"/>
                </LinearGradientBrush>
            </Path.Fill>
        </Path>

        <!-- Bar Cylinder -->
        <Rectangle x:Name="BarHollowCylinder" Width="73.636" Height="173.334" Canvas.Left="0.14" Canvas.Top="118.499" Stroke="#FFFFFFFF" StrokeThickness="1">
           
        </Rectangle>
            
        <Rectangle x:Name="BarCylinder" Width="73.636" Height="173.334" Canvas.Left="0.14" Canvas.Top="118.499" Stroke="#FFFFFFFF" StrokeThickness="1">
            <Rectangle.Fill>
                <LinearGradientBrush EndPoint="-0.133,-0.143" StartPoint="1.1,0.998">
                    <GradientStop Color="#FF143FFF" Offset="0"/>
                    <GradientStop Color="#FFD1EAFF" Offset="1"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>

        <!-- Bar Cylinder 2 -->
        <Rectangle x:Name="BarHollowCylinder2" Width="73.636" Height="173.334" Canvas.Left="200.14" Canvas.Top="118.499" Stroke="#FFFFFFFF" StrokeThickness="1">     
        </Rectangle>
            
        <Rectangle x:Name="BarCylinder2" Width="73.636" Height="173.334" Canvas.Left="200.14" Canvas.Top="118.499" Stroke="#FFFFFFFF" StrokeThickness="1">
            <Rectangle.Fill>
                <LinearGradientBrush EndPoint="-0.133,-0.143" StartPoint="1.1,0.998">
                    <GradientStop Color="#FF001161" Offset="0"/>
                    <GradientStop Color="#FF54B3FF" Offset="1"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>         
          
        <Canvas x:Name="GoalIndicatorCanvas" Canvas.Top="176.665">
	        <Path Width="260.088" Height="2" Stretch="Fill" Stroke="#FF88C0FF" StrokeEndLineCap="Round" StrokeStartLineCap="Round" StrokeThickness="1.5" Canvas.Left="6.33" Data="M929,162.499 L112.91177,162.499" RenderTransformOrigin="0.5,0.5">
		        <Path.RenderTransform>
			        <TransformGroup>
				        <ScaleTransform ScaleX="1" ScaleY="1"/>
				        <SkewTransform AngleX="0" AngleY="0"/>
				        <RotateTransform Angle="180"/>
				        <TranslateTransform X="0" Y="0"/>
			        </TransformGroup>
		        </Path.RenderTransform>
	        </Path>

	        <Rectangle Width="97" Height="26.167" Fill="#FFFFFFFF" Stroke="#FF8DC3FF" StrokeThickness="1" RadiusX="10" RadiusY="10" Canvas.Left="86" Canvas.Top="-11.832" />
        	        
            <TextBlock Width="102.362" Height="25.167" Canvas.Left="112" Canvas.Top="-10.832" FontFamily="Trebuchet MS" FontSize="10" Foreground="#FF1D62AF" TextWrapping="Wrap" Text="Your Goal:"/>            
            <TextBlock x:Name="GoalValueLabel" Width="102.362" Height="25.167" Canvas.Left="114" Canvas.Top="0.832" FontFamily="Trebuchet MS" FontSize="10" Foreground="#FF1D62AF" TextWrapping="Wrap" Text="^"/>            
        </Canvas>
        
		<TextBlock x:Name="BarValueLabel" Width="52.362" Height="24.5" Canvas.Left="13" Canvas.Top="294.506" FontFamily="Trebuchet MS" FontSize="12" FontWeight="Bold" Foreground="#FF1D62AF" Text="^^^^"/>
        <TextBlock x:Name="Bar2ValueLabel" Width="52.362" Height="24.5" Canvas.Left="213" Canvas.Top="294.506" FontFamily="Trebuchet MS" FontSize="12" FontWeight="Bold" Foreground="#FF1D62AF" Text="^^^^"/>
		<!--<TextBlock Width="52.362" Height="24.5" Canvas.Left="212" Canvas.Top="265.171" FontFamily="Trebuchet MS" FontSize="14" Foreground="#FFFFFFFF" TextWrapping="Wrap" Text="^^^^"/>-->
		<!--<TextBlock Width="73.636" Height="24.5" Canvas.Left="1.778" Canvas.Top="298.506" FontFamily="Trebuchet MS" FontSize="10" Foreground="#FF1D62AF" TextWrapping="Wrap" Text="if the market performs poorly"/>-->
		<TextBlock Width="110.989" Height="24.5" Canvas.Left="-2.456" Canvas.Top="310.506" FontFamily="Trebuchet MS" FontSize="10" Foreground="#FF1D62AF" TextWrapping="Wrap" Text="Initial investment without market growth"/>
        <TextBlock Width="100.989" Height="24.5" Canvas.Left="198.456" Canvas.Top="310.506" FontFamily="Trebuchet MS" FontSize="10" Foreground="#FF1D62AF" TextWrapping="Wrap" Text="Initial investment with market growth"/>
        <TextBlock x:Name="Bar2SavingsLabel" Text="    Monthly Contributions" Width="70" TextWrapping="Wrap" Foreground="Gray" Canvas.Left="207" Canvas.Top="210.506" FontFamily="Trebuchet MS" FontSize="10"/>
        <TextBlock x:Name="BarSavingsLabel" Text="    Monthly Contributions" Width="70" TextWrapping="Wrap" Foreground="Gray" Canvas.Left="6.5" Canvas.Top="210.506" FontFamily="Trebuchet MS" FontSize="10"/>
    </Canvas>
        <!-- End stuff to put in the tab -->
    </Canvas>
</UserControl>
